 <template>
  <div>
    <div class="big">
      <div class="sm">
        <img :src="nmm" alt="" class="i1" />
        <div class="cla">
          <img :src="item" @click="del(item)"  v-for="item in arrnew3" :key="item">
        </div>
      </div>
    </div>
  </div>
</template>
 <script>
export default {
  data() {
    return {
      arr: "",
      nmm: "",
      arrnew: [
        {
          icon: "https://img.alicdn.com/bao/uploaded/i1/1809143586/O1CN01hXQWxc1cMQwyhno1P_!!0-item_pic.jpg_200x200q90.jpg_.webp",
          pice: 9.9,
          name: "鞋架子简易门口宿舍家用室内好看收纳神器防尘鞋柜经济型卧室小型",
          yj: 5,
        },
        {
          icon: "https://img.alicdn.com/bao/uploaded/i2/3135717464/O1CN01AQxKVT250YsG9WtPF_!!0-item_pic.jpg_200x200q90.jpg_.webp",
          pice: 9.9,
          name: "鸭脖子零食大礼包网红小吃女生一箱充饥夜宵整箱散装休闲食品组合",
          yj: 5,
        },
        {
          icon: "https://img.alicdn.com/bao/uploaded///asearch.alicdn.com/bao/uploaded//i1/2972316483/O1CN012NCjIw1xlGOIxyqIV_!!0-item_pic.jpg_200x200q90.jpg_.webp",
          pice: 298,
          name: "欧洲站潮牌青少年外套男潮流百搭男装21年秋季新款夹克棒球服男潮",
          yj: 398,
        },
        {
          icon: "https://img.alicdn.com/bao/uploaded///asearch.alicdn.com/bao/uploaded//i1/1662994353/O1CN01BEL0lQ1i1ihAMqLqP_!!1662994353.jpg_200x200q90.jpg_.webp",
          pice: 167,
          name: "全纯净素食淯苗植物燕麦奶台湾麦片豆奶粉早餐即食冲饮谷物代餐粉",
          yj: 250,
        },
      ],
      arrnew2: [
        {
          id: 0,
          bimg: [
            "https://img.alicdn.com/imgextra/https://img.alicdn.com/imgextra/i2/1809143586/O1CN01vBUiiU1cMQwkDTfE4_!!1809143586.jpg_430x430q90.jpg",
            "https://img.alicdn.com/imgextra/https://img.alicdn.com/imgextra/i4/1809143586/O1CN01dCyUl01cMQwtxa1h1_!!1809143586.jpg_430x430q90.jpg",
            "https://img.alicdn.com/imgextra/https://img.alicdn.com/imgextra/i3/1809143586/O1CN01iaiEa51cMQvVo4GDn_!!1809143586.jpg_430x430q90.jpg",
            "https://img.alicdn.com/imgextra/https://img.alicdn.com/imgextra/i3/1809143586/O1CN010CAmy31cMQvXfIAml_!!1809143586.jpg_430x430q90.jpg",
            "https://img.alicdn.com/imgextra/https://img.alicdn.com/imgextra/i2/1809143586/O1CN018y7DuQ1cMQvSrKJAb_!!1809143586.jpg_430x430q90.jpg",
          ],
        },
        {
          bimg: [
            "https://img.alicdn.com/imgextra/i1/6000000006832/O1CN01jUsU5520L6cbG5Ujr_!!6000000006832-0-picassoopen.jpg_430x430q90.jpg",
            "https://img.alicdn.com/imgextra/i3/725677994/O1CN0186fdgJ28vIqe1d1GH_!!725677994.jpg_430x430q90.jpg",
            "https://img.alicdn.com/imgextra/i1/725677994/O1CN010MqLQI28vIqTgz7RS_!!725677994.jpg_430x430q90.jpg",
            "https://img.alicdn.com/imgextra/i4/725677994/O1CN01WBg1U128vIqcQ4wh8_!!725677994.jpg_430x430q90.jpg",
            "https://img.alicdn.com/imgextra/i4/725677994/O1CN01mGifyc28vIqaeHVzL_!!725677994.jpg_430x430q90.jpg",
          ],
          id: 1,
        },
        {
          bimg: [
            "https://img.alicdn.com/imgextra/i1/2972316483/O1CN012NCjIw1xlGOIxyqIV_!!0-item_pic.jpg_430x430q90.jpg",
            "https://img.alicdn.com/imgextra/i2/2972316483/O1CN01lXPTq51xlGOHD1Zqj_!!2972316483.jpg_430x430q90.jpg",
            "https://img.alicdn.com/imgextra/i4/2972316483/O1CN01Tum0Ys1xlGO8oK1YO_!!2972316483.jpg_430x430q90.jpg",
            "https://img.alicdn.com/imgextra/i4/2972316483/O1CN01fkDIj91xlGOIErceq_!!2972316483.jpg_430x430q90.jpg",
            "https://img.alicdn.com/imgextra/i1/2972316483/O1CN01j6QPpp1xlGO8oLAG9_!!2972316483.jpg_430x430q90.jpg",
          ],

          id: 2,
        },
        {
          id: 3,
          bimg: [
            "https://img.alicdn.com/imgextra/https://img.alicdn.com/imgextra/i3/2207820414138/O1CN01BV08Xa1gRFbXykYu9_!!2207820414138.jpg_430x430q90.jpg",
            "https://img.alicdn.com/imgextra/https://img.alicdn.com/imgextra/i3/2207820414138/O1CN01A0Sa7W1gRFbZ8sBXA_!!2207820414138.jpg_430x430q90.jpg",
            "https://img.alicdn.com/imgextra/https://img.alicdn.com/imgextra/i3/2207820414138/O1CN01BV08Xa1gRFbXykYu9_!!2207820414138.jpg_430x430q90.jpg",
            "https://img.alicdn.com/imgextra/https://img.alicdn.com/imgextra/i4/2207820414138/O1CN017keTZZ1gRFbNlSK46_!!2207820414138.jpg_430x430q90.jpg",
            "https://img.alicdn.com/imgextra/https://img.alicdn.com/imgextra/i2/2207820414138/O1CN01r0GPye1gRFcN7Qnws_!!2207820414138.jpg_430x430q90.jpg",
          ],
        },
      ],
      arrnew3:'',
    };
  },
  methods: {
    del(item) {
      this.nmm = item;
    },
  },
  mounted() {
    this.arr = this.$route.query.detail_id;
    this.arrnew2.forEach((item) => {
      if (item.id == this.arr) {
        this.arrnew3=item.bimg;
        console.log(this.arrnew3);
      }
    });
    this.nmm = this.arrnew3[0];
    console.log(this.nmm);
  },
  computed: {},
};
</script>
 <style lang='css' spend>
* {
  margin: 0;
  padding: 0;
}
.big {
  width: 1000px;
  height: 500px;
  margin: 0 auto;
}
.i1 {
  width: 500px;
  height: 300px;
  float: left;
}
.sm {
  width: 500px;
  height: 402px;
  border: 1px solid #000;
  position: relative;
}
.cla {
  width: 100%;
  height: 100px;
  border: 1px solid #000;
  position: absolute;
  bottom: 0px;
}
.cla img {
  width: 80px;
  height: 100%;
  float: left;
  margin-left: 15px;
}
</style>